<template>
	<view class="page">
		<nav-bar title="申请合伙人" :shadow="false"></nav-bar>
		<!-- 公共组件-每个页面必须引入 -->
		<public-module></public-module>
		<view class="input_form_box">
			<view class="input_box btm_line">
				<view class="name required">合伙人姓名</view>
				<view class="input_info"><input type="text" v-model="dutyName" placeholder="请输入合伙人姓名" placeholder-class="grey" /></view>
			</view>
			<view class="input_box marginTop btm_line">
				<view class="name required">合伙人年龄</view>
				<view class="input_info"><input type="number" v-model="age" placeholder="请输入合伙人年龄" placeholder-class="grey" /></view>
			</view>
			<view class="input_box marginTop btm_line">
				<view class="name required">合伙人手机</view>
				<view class="input_info"><input type="number" v-model="dutyPhone" placeholder="请输入合伙人手机号" placeholder-class="grey" /></view>
			</view>
			<view class="input_box marginTop">
				<view class="name required">合伙人身份验证</view>
				<view class="id_card_box">
					<view @click="onUnloadImg(1000)">
						<image v-if="dutyCardFront" :src="dutyCardFront" mode="aspectFill"></image>
						<image v-else="" src="../../../static/icon/theme/ic_upload_portrait.png" mode="aspectFit"></image>
					</view>
					<view @click="onUnloadImg(2000)">
						<image v-if="dutyCardReverse" :src="dutyCardReverse" mode="aspectFill"></image>
						<image v-else="" src="../../../static/icon/theme/ic_upload_nationalemblem.png" mode="aspectFit"></image>
					</view>
				</view>
			</view>
		</view>
		<view class="form_but"><button class="active" @click="onSubmit">确认提交</button></view>
	</view>
</template>

<script>
	import {
		mapState,
		mapMutations
	} from 'vuex';
	export default {
		data() {
			return {
				// 负责人姓名
				dutyName: '',
				//年龄
				age: '',
				// 负责人手机号
				dutyPhone: '',
				// 负责人身份证正面照
				dutyCardFront: '',
				// 负责人身份证反面照
				dutyCardReverse: '',
			};
		},
		//第一次加载
		onLoad(e) {
			if(e.level){
				this.level = e.level
			}
		},
		//页面显示
		onShow() {},
		//方法
		methods: {
			//上传图片
			// type = 1000 负责人身份证正面照
			// type = 2000 负责人身份证反面照
			onUnloadImg(type) {
				this.$http.qnImgUpload({
					count: 1
				}).then(res => {
					if (type == 1000) {
						this.dutyCardFront = res[0];
					} else if (type == 2000) {
						this.dutyCardReverse = res[0];
					}
				});
			},
			pageData() {

			},
			onPageJump(url) {
				uni.navigateTo({
					url: url
				});
			},
			onSubmit() {
				if (this.dutyName == '') {
					uni.showToast({
						title: '请输入合伙人姓名',
						icon: 'none'
					});
					return;
				}
				if (this.age == '') {
					uni.showToast({
						title: '请输入合伙人年龄',
						icon: 'none'
					});
					return;
				}
				if (this.dutyPhone == '') {
					uni.showToast({
						title: '请输入合伙人手机号',
						icon: 'none'
					});
					return;
				}
				if (!this.$base.phoneRegular.test(this.dutyPhone)) {
					uni.showToast({
						title: '合伙人手机号格式不正确',
						icon: 'none'
					});
					return;
				}
				if (this.dutyCardFront == '') {
					uni.showToast({
						title: '请上传合伙人身份证人像面',
						icon: 'none'
					});
					return;
				}
				if (this.dutyCardReverse == '') {
					uni.showToast({
						title: '请上传合伙人身份证国徽面',
						icon: 'none'
					});
					return;
				}
			
			let httpData = {
				level: this.level,
				name: this.dutyName,
				phone: this.dutyPhone,
				age: this.age,
				cardFront: this.dutyCardFront,
				cardReverse: this.dutyCardReverse,
			};
			this.$http.post('api/member_settle/v1/settle', httpData).then(res => {
				uni.showModal({
					title: '提示',
					content: '信息提交成功！等待工作人员审核~',
					showCancel: false,
					success: res => {
						uni.navigateBack({

						})
					}
				});
			});
		}
	},
	//页面隐藏
	onHide() {},
		//页面卸载
		onUnload() {},
		//页面下来刷新
		onPullDownRefresh() {},
		//页面上拉触底
		onReachBottom() {},
		//用户点击分享
		onShareAppMessage(e) {
			return this.wxShare();
		}
	};
</script>
<style lang="scss" scoped>
	@import '@/style/mixin.scss';

	.page {
		background-color: #fff;
		min-height: 100vh;
	}

	.marginTop {
		margin-top: 30rpx;
	}

	.input_form_box {
		margin: 0 60rpx;

		.input_box {
			padding: 0;
		}

		.grey {
			color: #cccccc;
		}
	}
	.form_but{
		margin-top: 60rpx;
		padding: 0 60rpx;
	}

	.id_card_box {
		width: 100%;
		display: flex;
		justify-content: center;
		padding-bottom: 30rpx;

		>view {
			width: 300rpx;
			height: 195rpx;

			&:nth-child(2) {
				margin-left: 40rpx;
			}

			image {
				width: 100%;
				height: 100%;
			}
		}
	}
</style>
